﻿/*
*作者:周祥
*时间:2013年11月06日
*介绍:图片上传预览插件 兼容浏览器(IE7-IE10 谷歌 火狐) 当然如果是使用这些内核的浏览器都兼容
*网站:http://jquery.decadework.com
*版本:1.0
*参数说明: Img:图片ID;Width:预览宽度;Height:预览高度;ImgType:支持文件类型;Callback:选择文件后回调方法;
*插件说明: 基于JQUERY扩展,需要引用JQUERY库。
*使用方法:  <div>
        <img id="ImgPr" width="120" height="120" /></div>
    <input type="file" id="up" />

     把需要进行预览的IMG标签外 套一个DIV 然后给上传控件ID给予uploadPreview事件

     $("#up").uploadPreview({ Img: "ImgPr", Width: 120, Height: 120, ImgType: ["gif", "jpeg", "jpg", "bmp", "png"], Callback: function () { }});    
*/
jQuery.fn.extend({
    uploadPreview: function (opts) {
        opts = jQuery.extend({
            Img: "ImgPr",
            Width: 100,
            Height: 100,
            ImgType: ["gif", "jpeg", "jpg", "bmp", "png"],
            Callback: function () { }
        }, opts || {});
        var _self = this;
        var _this = $(this);
        var getObjectURL = function (file) {
            var url = null;
            if (window.createObjectURL != undefined) {
                url = window.createObjectURL(file);
            } else if (window.URL != undefined) {
                url = window.URL.createObjectURL(file);
            } else if (window.webkitURL != undefined) {
                url = window.webkitURL.createObjectURL(file);
            }
            return url;
        }
        _this.change(function () {
            if (this.value) {
                if (!RegExp("\.(" + opts.ImgType.join("|") + ")$", "i").test(this.value.toLowerCase())) {
                    alert("选择文件错误,图片类型必须是" + opts.ImgType.join("，") + "中的一种");
                    this.value = "";
                    return false;
                }
                if ($.browser.msie && $.browser.version <= 9.0) {
                    var src = "";
                    var obj = $("#" + opts.Img);
                    var div = obj.parent("div")[0];
                    _self.select();
                    if (top != self) {
                        window.parent.document.body.focus();
                    } else {
                        _self.blur();
                    }
                    src = document.selection.createRange().text;
                    document.selection.empty();
                    obj.hide();
                    obj.parent("div").css({
                        'filter': 'progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=scale)',
                        'width': opts.Width + 'px',
                        'height': opts.Height + 'px'
                    });
                    div.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = src;
                } else {
                    $("#" + opts.Img).attr('src', getObjectURL(this.files[0]));
                }
                opts.Callback();
            }
        });
    }
});